<template>
	<view class="content">
		<view class="header"><image class="logo" src="../../static/logo.png"></image></view>
		<view class="agreement">
			<image class="btn" @tap="agreementSuccess" :src="agreement == true ? '/static/login/ty1.png' : '/static/login/ty0.png'"></image>
			<text @tap="agreementSuccess">同意</text>
			<navigator url="agreement?id=1" open-type="navigate">《用户协议》</navigator>
		</view>
		<button class="button-login" @click="login">微信一键登录</button>
	</view>
</template>

<script>
export default {
	data() {
		return {
			userInfo: {},
			agreement: true
		};
	},
	onLoad(option) {},
	methods: {
		login() {
			let code = '';
			uni.login({
				success: res => {
					code = res.code;
				}
			});
			let that = this;
			uni.getUserProfile({
				provider: 'weixin',
				desc: '登录获取用户信息',
				lang: 'zh_CN',
				success: function(info) {
					console.log('用户信息：' + JSON.stringify(info));
					let param = info.userInfo;
					param.code = code;
					param.appId = that.$request.appid;
					that.$request.globalRequest('/app/login', 'post', param).then(res => {
						console.log('用户信息登录结果：' + JSON.stringify(res));
						if (res.code == 200) {
							uni.showToast({
								title: '登录成功',
								icon: 'none'
							});
							if (res.data) {
								uni.setStorageSync('userInfo', res.data);
							}
							setTimeout(that.goIndex, 1000);
						}
					});
				},
				fail: function(err) {
					console.log('获取用户信息出错：' + JSON.stringify(err));
				}
			});
		},
		goIndex() {
			uni.navigateTo({
				url: '../index/index'
			});
		},
		agreementSuccess() {
			this.agreement = !this.agreement;
		}
	}
};
</script>

<style lang="scss" scoped>
page {
	background-color: #ffffff;
}

.content {
	display: flex;
	flex-direction: column;
	justify-content: center;

	.header {
		align-self: center;
		padding: 20%;
		.logo {
			align-self: center;
			width: 200rpx;
			height: 200rpx;
		}
	}

	.agreement {
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		font-size: 30rpx;
		color: #ffa800;
		text-align: center;
		height: 40rpx;
		line-height: 40rpx;
		margin-top: 40%;
		.btn {
			width: 40rpx;
			height: 40rpx;
		}
	}

	.button-login {
		color: #ffffff;
		font-size: 34rpx;
		width: 470rpx;
		height: 100rpx;
		line-height: 100rpx;
		background: linear-gradient(-90deg, #5c8bfd, #2c65ef);
		box-shadow: 0rpx 0rpx 13rpx 0rpx #5c8bfd;
		border-radius: 20rpx;
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		margin-top: 10rpx;
	}
}
</style>
